<template>
  <div>
    <h3>房价计划增加</h3>
    <table class="table table-bordered">
      <tbody>
        <tr>
          <td align="right">房价计划名称</td>
          <td><input type="text" v-model="info.title" /></td>
        </tr>
        <tr>
          <td align="right">房型</td>
          <td>
            <select v-model="info.houseTyPeId">
              <option value="">请选择</option>
              <option :value="item.id" v-for="item in data1.list">
                {{ item.houseTypeName }}
              </option>
            </select>
          </td>
        </tr>
        <tr>
          <td align="right">房间价格</td>
          <td><input type="text" v-model="info.price" /></td>
        </tr>
        <tr>
          <td align="right">房间数量</td>
          <td><input type="text" v-model="info.count" /></td>
        </tr>
        <tr>
          <td align="right">早餐数量</td>
          <td><input type="text" v-model="info.breakFast" /></td>
        </tr>
        <tr>
          <td align="right">状态</td>
          <td>
            <input
              type="radio"
              name="state"
              :value="1"
              v-model="info.status"
            />开启
            <input
              type="radio"
              name="state"
              :value="0"
              v-model="info.status"
            />禁用
          </td>
        </tr>
        <tr>
          <td align="right">有效时间</td>
          <td>
            <input type="date" v-model="info.startTime" />-
            <input type="date" v-model="info.endTime" />
          </td>
        </tr>
        <tr>
          <td align="right">计划特色</td>
          <td>
            <input
              type="checkbox"
              name="features"
              v-model="info.features"
              value="贵"
            />贵
            <input
              name="features"
              type="checkbox"
              v-model="info.features"
              value="舒适"
            />舒适
            <input
              type="checkbox"
              name="features"
              v-model="info.features"
              value="服务周到"
            />服务周到
          </td>
        </tr>
        <tr>
          <td align="right"></td>
          <td>
            <input
              type="button"
              value="增加"
              class="btn btn-primary"
              @click="ok"
            />
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
import axios from 'axios';
import moment from 'moment';
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
const route = useRoute();

//存储增加需要的数据
let info: any = reactive({
  title: '',
  houseTyPeId: '',
  price: '',
  startTime: '',
  endTime: '',
  features: [],
  status: 1,
  breakFast: '',
  count: '',
});

let info1: any = reactive({
  pageIndex: 1,
  pageSize: 100,
  houseTpyeName: '',
  area1: '',
  area2: '',
});

let data1: any = reactive({
  list: [],
  totalCount: 0,
  totalPage: 0,
});

onMounted(() => {
  getHouseTypeList();
});

const ok = () => {
  //1.判断有效性
  //2.发送网络请求
  info.features = info.features.toString();
  axios({
    url: '/api/HouseTypes/AddHousePlan',
    method: 'post',
    data: info,
  })
    .then((res) => {
      console.log(res);
      if (res.data == -1) {
        alert('计划名称重复');
        return;
      }

      if (res.data > 0) {
        alert('添加成功');
        router.push('housePlanList');
      } else {
        alert('添加失败');
        return;
      }
    })
    .catch((err) => {
      console.log(err);
    });
};

//获取房型列表
const getHouseTypeList = () => {
  axios({
    url: '/api/HouseTypes/GetHouseTypeList',
    method: 'get',
    params: info1,
  })
    .then((res) => {
      console.log(res);
      Object.assign(data1, res.data);
    })
    .catch((err) => {
      console.log(err);
    });
};
</script>

<style scoped></style>
